<template>
  <div class="headerBar">
    <el-col :span="24" class="barLeft">
      <i class="iconfont" @click="routerBack()">&lt;</i>
      {{ title }}
    </el-col>
  </div>
</template>

<script>
export default {
  props: [], // 子组件接收信息
  data () {
    return {
      title: '标题'
    }
  },
  methods: {
    routerBack () { // 路由返回
      if (window.history.length < 1) {
        console.log('Return False')
        return false
      } else {
        this.$router.back(-1)
      }
    }
  },
  created () {
    switch (this.$route.path) { // 标题栏信息
      case '/shopping': this.title = this.$store.state.title.shopping; break
      case '/order': this.title = this.$store.state.title.myOrder; break
      case '/home': this.title = this.$store.state.title.home; break
      case '/user/withdrawals': this.title = this.$store.state.title.withDraw; break
      case '/user/record': this.title = this.$store.state.title.withDrawRecord; break
      case '/user/bankcard': this.title = this.$store.state.title.myBankcard; break
      case '/user/address': this.title = this.$store.state.title.myAddress; break
      case '/shopping/purchase': this.title = this.$store.state.title.uploadOrder; break
      case '/user/areaOrder': this.title = this.$store.state.title.areaOrder; break
      case '/user/disOrder': this.title = this.$store.state.title.disOrder; break
      case '/user/distributor': this.title = this.$store.state.title.distributor; break
      case '/user/commission': this.title = this.$store.state.title.commission; break
      case '/user/code': this.title = this.$store.state.title.code; break
      case '/user/changePsWord': this.title = this.$store.state.title.changeps; break
      default: break
    }
  }
}
</script>

<style lang="scss" type="stylesheet/scss">
.headerBar {
  display: flex;
  justify-content: flex-start;
  height: 50px;
  background-color: #55AA55;
  color: white;
  padding: 0 20px;
  line-height: 50px;
  text-align: center;
  .iconfont {
    display: inline-block;
    position: absolute;
    left: 20px;
    font-size: 20px;
    width: 50px;
  }
}
</style>
